<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			function load(){
				let c = document.getElementById('myC');
				let context = c.getContext('2d');

				context.fillStyle="#FF00FF";
				context.strokeStyle="#0000FF";
				context.fillRect(20,20,100,100);
				context.strokeRect(20,20,100,100);
				context.fill();
				context.stroke();

				context.save();

				context.fillStyle="#FF0000";
				context.strokeStyle="#00FF00";
				context.fillRect(140,20,100,100);
				context.strokeRect(140,20,100,100);
				context.fill();
				context.stroke();

				context.restore();
				context.fillRect(20,140,50,50);
				context.strokeRect(80,140,50,50);
				context.fill();
				context.stroke();

			}

			window.onload = function(){
				load();
			}
		</script>
	</head>
	<body>
		<canvas id="myC" style="border: 1px #000 solid;" width="800" height="450">
			你的浏览器不支持canvas元素！
		</canvas>
	<div><script language="javascript">

	</script></div></body>
</html>
